<template>
	<!-- 20230202 -->
	<view class="mall-my-evaluate-add-page">
		<!-- 页面内容 -->
		<view class="page-content">
			<!-- 订单产品循环 -->
			<view>
				<view class="margin-bottom-20 padding-lr-30 bg-ff" v-for="(item,index) in orderProduct"
					:key="index">

					<!-- 产品 -->
					<view class="padding-tb-10 dashed-bottom-ed">
						<jc-mall-orderProducts :list="[item]"></jc-mall-orderProducts>
					</view>

					<!-- 评语 -->
					<view class="padding-top-30 padding-bottom-15">
						<textarea class="width-100p text-30 line-40" style="height:160rpx;" v-model="item.content"
							maxlength="200" placeholder="亲,咱平台的服务能够达到您的预期吗?您的评价是商家不断进步的源泉,写点什么吧" />
					</view>

					<!-- 图片和视频 -->
					<view class="padding-bottom-15">
						<ty-image-images-upload :index="index" @imageChange="imageChange" @videoChange="videoChange">
						</ty-image-images-upload>
					</view>
				</view>
			</view>

			<view class="jc-footer-safe">
				<view class="margin-tb-10 padding-lr-30" @click="confirm">
					<view class="line-height-80 radius-40 bg-main text-center text-30 text-ff">确定</view>
				</view>
			</view>
		</view>
		
		<!-- 页面浮层 -->
		<view class="page-layer">
			
		</view>
	</view>
</template>

<script>
	import mall from '../api/mall.js'
	export default {
		data() {
			return {
				orderId: 0,
				orderProduct: [],
			}
		},

		onLoad(options) {
			this.orderId = options.id || ''
		},

		onReady() {
			// 加载订单详情
			mall.order.getMyOrder(this.orderId).then(res => {
				if (res.code == 0) {
					let mallOrderProduct = res.data.detail.mallOrderProduct
					let curMallOrderProduct = []
					mallOrderProduct.forEach((val, index) => {
						if (val.number > val.refund_total_number) {
							val.content = ''
							val.img_path = []
							val.video_path = []
							curMallOrderProduct.push(val)
						}
					})
					this.orderProduct = curMallOrderProduct
				}
			})
		},

		methods: {
			//图片改变
			imageChange(e) {
				this.orderProduct[e.index].img_path = e.image_list;
			},

			//视频改变
			videoChange(e) {
				this.orderProduct[e.index].video_path = e.video_list;
			},

			// 评价
			confirm() {
				let can_submit = true
				this.orderProduct.forEach(val => {
					if (!val.content) {
						can_submit = false
						return false
					}
				})
				if (!can_submit) {
					this.cn.toast('评论内容必填')
					return false
				}

				mall.evaluate.insertAppendEvaluate(this.orderId, JSON.stringify(this.orderProduct)).then(res => {
					if (res.code == 0) {
						this.cn.alert(res.msg).then(res => {
							uni.navigateBack({
								delta: 1
							})
						})
					}
				})
			}
		}
	}
</script>

<style scoped>
	/* 页面内容 */
	.page-content{
		padding-bottom: calc(env(safe-area-inset-bottom) + 100rpx + 20rpx);
	}
</style>
